<button mat-button [matMenuTriggerFor]="basic">Basic Menu</button>
<button mat-button [matMenuTriggerFor]="nested">Nested Menu</button>

<mat-menu #basic="matMenu">
  <button mat-menu-item>Item 1</button>
  <button mat-menu-item>Item 2</button>
  <button mat-menu-item>Item 3</button>
  <button mat-menu-item>Item 4</button>
  <button mat-menu-item>Item 5</button>
  <button mat-menu-item>Item 6</button>
  <button mat-menu-item>Item 7</button>
  <button mat-menu-item>Item 8</button>
  <button mat-menu-item>Item 9</button>
  <button mat-menu-item>Item 10</button>
</mat-menu>

<!-- Nested Menu with 3 Levels -->

<mat-menu #nested="matMenu">
  <button mat-menu-item [matMenuTriggerFor]="sub1">Sub Menu 1</button>
</mat-menu>

<mat-menu #sub1="matMenu">
  <button mat-menu-item [matMenuTriggerFor]="sub2">Sub Menu 2</button>
</mat-menu>

<mat-menu #sub2="matMenu">
  <button mat-menu-item>Item 1</button>
  <button mat-menu-item>Item 2</button>
  <button mat-menu-item>Item 3</button>
  <button mat-menu-item>Item 4</button>
  <button mat-menu-item>Item 5</button>
</mat-menu>
